<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>Insert title here</title>
</head>
<body>
	<script type="text/javascript" src="/js/user_panel.js" charset="UTF-8"></script>
	<link rel="stylesheet" href="/css/form.css" type="text/css">
	<link rel="stylesheet" href="/css/user_panel.css" type="text/css">
	<#include "/head.ftl"/>
	<div class="content">
		<div class="content-left">
			<div class="overview">
				<div class="photo">
					<#if userinfo.photo!=''> 
						<img src="/file/image/${userinfo.photo}" width="20px" height="20px" onclick="update_photo()">
					<#else> 
						<img src="/images/default-head.jpg" width="20px" height="20px" onclick="update_photo()">
					</#if>
					<div class="name">${Session.userinfo.name}</div>
					<div class="position">${userinfo.deptOffice.name}/${userinfo.dept.name}</div>
				</div>
				<!-- <div class="my-massage">
					我的消息
					<div class="massage-num">5</div>
				</div> -->
				<!-- <div class="my-email">
					我的邮件
					<div class="email-num">0</div>
				</div> -->
				<a class="button" onclick="add_fancy()">写便签</a>
			</div>
			<div class="base-manage">
				<div class="title">基本资料</div>
				<div class="education">
					<div class="head">
						<i class="iconfont icon-book"></i> 学历
					</div>
					<div class="tent">${userinfo.graduationSchool}/${userinfo.education}</div>
	
				</div>
				<div class="phone">
					<div class="head">
						<i class="iconfont icon-phone_surface"></i> 手机
					</div>
					<div class="tent">${userinfo.tel}</div>
	
				</div>
				<div class="address">
					<div class="head">
						<i class="iconfont icon-coordinates_fill"> </i>地址
					</div>
					<div class="tent">${userinfo.address}</div>
	
				</div>
			</div>
		</div>
		<div class="content-right">
			<div id="tab">
				<div class="my_tab selected" data-tab="1">我的便签</div>
				<div class="my_tab" data-tab="2">个人信息</div>
				<div class="my_tab" data-tab="3">系统设置</div>
			</div>
			<div class="container">
				<div data-content="1" class="tent">
					<div class="my_note">
						<div class="note_title">
							<a class="star" onclick="changeStar(this)">
								<i class="iconfont icon-xing"></i>
							</a>
							<a class="star" onclick="changeStar(this)" style="display: none;">
								<i class="iconfont icon-xing1"></i>
							</a>
							便签标题
							<div class="delete">
								<i class="iconfont icon-guanbi"></i>
							</div>
						</div>
						<div class="note_time">2017/8/22 16:17:09</div>
						<br>
						<div class="note_tent">标签内容标签内容标签内容标签内容标签内容标签内容标签内容标签内容标签内容标签内容标签内容标签内容标签内容标签内容</div>
						<div class="star_update">
							<span class="update">
								<i class="iconfont icon-edit"></i>修改
							</span>
						</div>
					</div>
				</div>
				<div data-content="2" class="tent" style="display: none;">
					<form method="post" class="form-content" id="baseForm">
						<fieldset>
							<legend>基本信息</legend>
							<table>
								<tr>
									<td>真实姓名：</td>
									<td>${userinfo.realName}</td>
									<td>身份证号：</td>
									<td>${userinfo.identity}</td>
								</tr>
								<tr>
									<td>性别：</td>
									<td>${userinfo.sex}</td>
									<td>职位：</td>
									<td>${userinfo.deptOffice.name}/${userinfo.dept.name}</td>
								</tr>
								<tr>
									<td>学历：</td>
									<td>${userinfo.education}</td>
									<td>毕业院校：</td>
									<td>${userinfo.graduationSchool}</td>
								</tr>
								<tr>
									<td>联系电话：</td>
									<td><input type="text" name="tel" value="${userinfo.tel}"></td>
									<td>联系邮箱：</td>
									<td><input type="text" name="email" value="${userinfo.email}"></td>
								</tr>
								<tr>
									<td>出生日期：</td>
									<td><input class="birth" name="birDay" type="text"
										onfocus="WdatePicker({dateFmt:'yyyy-MM-dd',readOnly:true})" value="${userinfo.bir}"></td>
								</tr>
								<tr>
									<td>联系地址：</td>
									<td colspan="3"><input type="text" name="address" value="${userinfo.address}"></td>
								</tr>
								<tr>
									<td>银行卡号：</td>
									<td colspan="3"><input type="text" name="bank" value="${userinfo.bank}"></td>
								</tr>
								<tr>
									<td colspan="4" style="text-align: center;"><input name="save" type="submit" value="保存" class="button ${userinfo.skin}" ></td>
								</tr>
							</table>
						</fieldset>
					</form>
				</div>
				<div data-content="3" class="tent" style="display: none;">
					<div class="update_password">
						<form method="post" class="form-content" id="systemForm">
						<fieldset>
							<legend>系统设置</legend>
							<table>
								<tr>
									<td>用户名：</td>
									<td><input type="text" name="name" value="${userinfo.name}"></td>
								</tr>
								<tr>
									<td>密  码：</td>
									<td id="pwd" data-pwd="${userinfo.password}">
										<div class="hidePwd pwd">
											<input type="password" name="password" placeholder="密码长度在6-12位之间" onkeyup="copyPwd(this)" maxlength="20">
											<a class="eye" onclick="changeEye(this)"><i class="iconfont icon-eye"></i></a>
										</div>
										<div class="showPwd pwd">
											<input type="text" name="passwordText" placeholder="密码长度在6-12位之间" onkeyup="copyPwd(this)" maxlength="20">
											<a class="eye" onclick="changeEye(this)"><i class="iconfont icon-eye-close"></i></a>
										</div>
									</td>
								</tr>
								<tr>
									<td>新密码：</td>
									<td>
										<div class="hidePwd pwd">
											<input type="password" name="newPassword" placeholder="密码长度在6-12位之间" onkeyup="copyPwd(this)" maxlength="20">
											<a class="eye" onclick="changeEye(this)"><i class="iconfont icon-eye"></i></a>
										</div>
										<div class="showPwd pwd">
											<input type="text" name="passwordText" placeholder="密码长度在6-12位之间" onkeyup="copyPwd(this)" maxlength="20">
											<a class="eye" onclick="changeEye(this)"><i class="iconfont icon-eye-close"></i></a>
										</div>
									</td>
								</tr>
								<tr>
									<td>皮肤：</td>
									<td>
										<select name="skin">
											<#if userinfo.skin=='green'>
												<option value="green" selected="selected">青草绿</option>
												<option value="red">烈焰红</option>
												<option value="blue">经典蓝</option>
											<#elseif userinfo.skin=='red'>
												<option value="red" selected="selected">烈焰红</option>
												<option value="green">青草绿</option>
												<option value="blue">经典蓝</option>
											<#elseif userinfo.skin=='blue'>
												<option value="blue" selected="selected">经典蓝</option>
												<option value="green">青草绿</option>
												<option value="red">烈焰红</option>
											</#if>
										</select>
									</td>
								</tr>
								<tr>
									<td colspan="2" style="text-align: center;">
										<input type="hidden" name="id" value="${userinfo.id}">
										<input name="save" class="button ${userinfo.skin}" type="submit" value="保存">
									</td>
								</tr>
								<tr>
									<td colspan="2" style="text-align: center;font-size: 12px;color: #aa0000;">系统设置修改需要重新登录系统</td>
								</tr>
							</table>
							</fieldset>
						</form>
					</div>
				</div>
			</div>

		</div>
	</div>

	<div class="fancy_box" id="fancy_box">
		<div class="fancy_skin">
			<div class="fancy_title">
				<input name="title" type="text" placeholder="标题（必填）">
			</div>
			<div class="fancy_body">
				<textarea rows="8" cols="50" placeholder="标签（必填）"></textarea>
			</div>
		</div>
	</div>
	<div id="old_photo">
		<div class="old_photo">
			<#if userinfo.photo!=''> 
				<img src="/file/image/${userinfo.photo}">
			<#else> 
				<img src="/images/default-head.jpg">
			</#if>
		</div>
		<div class="select_photo">
			<form id="scform" action="upload" method="post"
				enctype="multipart/form-data">
				<input type="file" name="f" id="f">
			</form>
			<div class="scfile" onclick="upimg()">点击这里上传文件</div>
		</div>
	</div>

</body>
</html>